<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../css/login/login.css"></link>

    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
    <style>

    </style>
</head>
<body>

<form action="index. html" class="login-form">
    <h1>登录</h1>
    <div class="txtb">
        <i class="user"></i>
        <input type="text" id="user" >
        <span data-placeholder="用户名"></span>
    </div>
    <div class="txtb">
        <input type="password" class="password">
        <span data-placeholder="密码"></span>
    </div>
    <!--<div class="txtb">-->
    <!--    <input type="text" class="check">-->
    <!--    <span data-placeholder="验证码"></span>-->
    <!--    &lt;!&ndash;<img src="img/验证码测试.png">&ndash;&gt;-->
    <!--</div>-->
    <input type="submit" class="logbtn" value="登录">
    <div class="bottom-text">
        没有账号？<a href="register.html">注册</a>
    </div>
</form>


<script>
    $(".txtb input").on("focus", function () {
        $(this).addClass("focus");
    });

    $(".txtb input").on("blur", function () {
        if ($(this).val() == "")
            $(this).removeClass("focus");
    });
</script>
</body>
</html>